<template>
	<view>
		<view class="place-view">
			<view class="place-addres" v-if="flag" @click="getAddress">
				+ 新增收货地址
			</view>
			<!-- 已选中收货地址 -->
			<view class="goods-address" v-if="!flag" @click="getAddress">
				<view class="goods-address-left">
					<image src="../../static/coen/address.png" mode="widthFix"></image>
				</view>
				<view class="goods-address-in">
					<view>{{address.detailInfo}}</view>
					<view class="goods-address-name">
						<text>{{address.userName}}</text>
						<text>{{address.telNumber}}</text>
					</view>
				</view>
				<view class="goods-address-right">
					<image src="../../static/coen/jiantou.png" mode="widthFix"></image>
				</view>
			</view>
			<view class="place-time">
				<image src="../../static/coen/times.png" mode="widthFix"></image>
				<text>立即送出</text>
			</view>
		</view>
		<!-- 菜单 -->
		<view class="place-view">
			<view>
				<block v-for="(item,index) in optionData.allorder" :key="index">
					<view class="order-view">
						<view class="order-img">
							<image :src="item.objdis.image" mode="aspectFill"></image>
						</view>
						<view class="order-title">
							<text>{{item.objdis.input}}</text>
							<text>x{{item.objdis.number}}</text>
						</view>
						<view class="order-price">
							单价:¥{{item.objdis.Discount}}
						</view>
					</view>
				</block>
			</view>
		</view>
		<!-- 配送费 -->
		<view class="place-view">
			<view class="Delivery">配送费：{{optionData.physical}}</view>
		</view>
		<!-- 高度 -->
		<view style="height: 140upx;"></view>
		<!-- 支付 -->
		<view class="payment">
			<view class="payment-left">
				<text>合计</text>
				<text>¥{{optionData.payment}}</text>
			</view>
			<view class="payment-right" @click="gotopay">
				去支付
			</view>
		</view>


	</view>
</template>

<script>
	import {
		wxpaying
	} from "@/api/api/pay.js"
	export default {
		data() {
			return {
				optionData: {},
				flag: true,
				address: {}
			}
		},
		onLoad(option) {

			this.optionData = JSON.parse(option.data)
			console.log('optionData', this.optionData)
		},
		methods: {
			getAddress() {
				wx.chooseAddress({
					success: (res) => {

						this.address = res

						this.flag = false

					}
				})

			},
			gotopay() {
				if (JSON.stringify(this.address) === '{}') {
					console.log('没有地址')
				} else {
					console.log('有地址')
					this.pay()
				}
			},
			async pay() {
				// 搞定必填参数
				// 客户信息\
				let optionData = this.optionData
				let peopleobj = {
					address: this.address.detailInfo,
					name: this.address.userName,
					iphone: this.address.telNumber
				}

				let Paymentinfor = {
					type: 'placeOrder',
					peopleobj,
					arrinfo: optionData.allorder,
					merchantid: optionData.MerchantId,
					ide: optionData.MerchantId.slice(0, 7),
					commod: optionData.nameshop,
					logo: optionData.logo,
					useropenid: optionData.openid,
					payment: optionData.payment
				}
				console.log(Paymentinfor)
				let wxpayingData = await this.wxpaying(Paymentinfor)
				await this.wxpay(wxpayingData)
				this.isPay(wxpayingData)
				
			},
			async wxpaying(Paymentinfor) {
				const {
					data: res
				} = await wxpaying(Paymentinfor)
				if (res.msg === "SUCCESS") {
					return res.datas
				}

			},
			wxpay(wxpayingData) {
				return new Promise((resolve,reject)=>{
					wx.requestPayment({
						timeStamp: wxpayingData.time_stamp,
						nonceStr: wxpayingData.nonceStr,
						package: `prepay_id=${wxpayingData.prepayId}`,
						signType: 'MD5',
						paySign: wxpayingData.payauto,
						success: (res) => {
							console.log('successpay', res)
							resolve (res)
						},
						fail: (err) => {
							// log(err)
							console.log('failpay', err)
							reject (err)
							// let succ = '取消支付'
							// let ico = 'success'
							// this.tIps(succ,ico)
						}
					})
				})
			},
			async isPay(wxpayingData) {
				let data = {
					type: 'paysucc',
					out_trade_no: wxpayingData.out_trade_no,
					id: wxpayingData._id,
					merchantid: this.optionData.MerchantId
				}
				
				const res = await wxpaying(data)
				// if (res.msg === "SUCCESS") {
				console.log('isPay', res)
				// }

			}
		}
	}
</script>


<style>
	page {
		background: #F4f4f4;
	}

	.place-view {
		background: #FFFFFF;
		margin: 20upx;
		border-radius: 9upx;
		padding: 35upx 15upx;
	}

	.place-addres {
		border: 1rpx solid #ffb000;
		width: 400upx;
		height: 80upx;
		line-height: 80upx;
		border-radius: 50upx;
		text-align: center;
		color: #ffb000;
		margin: 0 auto;
		font-size: 30upx;
	}

	.place-time image {
		width: 40upx;
		height: 40upx;
		padding-right: 20upx;
	}

	.place-time {
		display: flex;
		align-items: center;
		font-size: 30upx;
		border-top: 1rpx solid #F4f4f4;
		padding-top: 35upx;
		margin-top: 35upx;
	}

	/* 菜单 */
	.order-view {
		display: flex;
		height: 150upx !important;
		overflow: hidden;
		margin-bottom: 15upx;
		font-size: 30upx;
	}

	.order-view text {
		display: block;
	}

	.order-img {
		width: 200upx !important;
		height: 150upx !important;
		padding-right: 15upx;
	}

	.order-img image {
		width: 100%;
		height: 100%;
	}

	.order-title {
		flex-grow: 1;
	}

	.order-title text:nth-child(2) {
		color: #999999;
		font-size: 25upx;
	}

	.Delivery {
		display: flex;
		justify-content: flex-end;
		font-size: 30upx;
	}

	/* 支付 */
	.payment {
		background: #FFFFFF;
		height: 120upx;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 30upx;
	}

	.payment-left {
		display: flex;
		align-items: center;
		font-size: 30upx;
	}

	.payment-left text:nth-child(2) {
		font-weight: bold;
		font-size: 32upx;
	}

	.payment-right {
		background: #07c160;
		color: #FFFFFF;
		padding: 20upx 60upx;
		font-size: 30upx;
		border-radius: 7upx;
	}

	/* 收货地址 */
	.goods-address-left {
		width: 40upx;
		height: 40upx;
		padding-right: 20upx;
	}

	.goods-address-left image {
		width: 40upx;
		height: 40upx;
	}

	.goods-address-name {
		display: flex;
		align-items: center;
		font-size: 28upx;
		padding-top: 10upx;
	}

	.goods-address-right {
		width: 40upx;
		height: 40upx;
	}

	.goods-address-right image {
		width: 40upx;
		height: 40upx;
	}

	.goods-address {
		display: flex;
		align-items: center;
	}

	.goods-address-in {
		flex-grow: 1;
		font-size: 30upx;
	}

	.goods-address-name text:nth-child(1) {
		padding-right: 10upx;
	}
</style>
